<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    const url = "http://123.207.32.32:8000/home/multidata"
    const url1 = "http://123.207.32.32:1888/02_param/postjson"
    // 1.fetch发送get请求
    // 未优化的代码
    fetch(url).then(res => {
      // 获取具体的结果
      res.json().then(res => {
        console.log(res)
      })
    }).catch(err => {
      console.log(err)
    })

    // 优化方式一:
    fetch(url).then(res => res.json()).then(res => console.log(res))

    // 优化方式二:
    async function getData() {
      const res = await fetch(url)
      const data = await res.json()
      console.log('getData', data)
    }
    getData()

    // 2.post请求并且有参数
    async function getData1() {
      const response = await fetch(url1, {
        method: 'post',
        headers: { "Content-type": "application/json" },
        body: JSON.stringify({ name: 'why', age: 18 })
      })
      // 获取response状态
      console.log(response.ok, response.status, response.statusText)

      const data = await response.json()
      console.log('getData1', data)
    }
    getData1()
  </script>
</body>

</html>